﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta http-equiv="Pragma" content="no-cache">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="format-detection" content="telephone=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <link rel="stylesheet" href="css/ydui.css" />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="stylesheet" type="text/css" href="css/webbase.css" />
    <link rel="stylesheet" type="text/css" href="css/pages-seckillOrder.css" />
    <script type="text/javascript" src="js/ydui.flexible.js"></script>
    <script type="text/javascript" src="js/sys-verification.js"></script>
    <title></title>
</head>
<script type="text/javascript" src="js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="js/plugins/jquery-placeholder/jquery.placeholder.min.js"></script>
<script type="text/javascript" src="js/widget/nav.js"></script>
<script src="./js/vue/vue.js"></script>
<script src="./js/vue/vuetify.js"></script>
<script src="./js/axios.min.js"></script>
<script src="./js/common.js"></script>
<body>
<!--页面顶部白条条，由js动态加载-->
<script type="text/javascript" src="plugins/jquery/jquery.min.js"></script>
<div class="nav-bottom"></div>
<script type="text/javascript">$(".nav-bottom").load("top.html");</script>
<div id="evaluateApp">
    <section class="g-flexview">
        <header class="m-navbar">
            <a href="" class="navbar-item"><i class="back-ico"></i></a>
            <div class="navbar-center"><span class="navbar-title">评价</span></div>
        </header>
        <section class="g-scrollview  Start_scrollview">
            <div class="title_hall margin02"><i class="icon_title"></i>评价</div>
            <div class="m-cell announcement" v-for="detail in item.detailList">
                <ul>
                    <li>
                        <img :src="detail.image">
                    </li>
                    <li>{{detail.title}}</li>
                    <li>{{detail.ownSpec}}</li>
                </ul>
                <br/>
                <br/>
                <div>
                    <input type="radio" name="score" value="5" v-model="detail.score">5星
                    <input type="radio" name="score" value="4" v-model="detail.score" >4星
                    <input type="radio" name="score" value="3" v-model="detail.score">3星
                    <input type="radio" name="score" value="2" v-model="detail.score">2星
                    <input type="radio" name="score" value="1" v-model="detail.score">1星
                </div>

                <ul class="appraisalstyle" id="appraisal">
<!--                    <li class="appraisal_level">-->
<!--                        <span class="Required cell-item" data-key="satisfied" data-type="satisfied" data-array="非常满意,满意,一般,不满意" :data-value="score" data-method="SelectionBox" data-mode="radio">-->
<!--                        </span>-->
<!--                    </li>-->
                    <li class="padding02 ">
                        <textarea data-name="评价内容" id="textarea" data-prompt="text_content" data-type="summary" data-key="summary" data-verify="verify" data-stint="Wordcount" size="300" class="Required form-textarea col-sm-12 textarea height100 mr10" placeholder="请对服务做个简单评价"
                                  v-model="detail.text" ></textarea>

                    </li>
                    <li class="jsoncontent" id="jsoncontent">
                    </li>
                </ul>
            </div>
            <li class="padding02">
                <button type="button" class="btn-block btn-bule" id="modifybtn1" @click="addEvaluate()">发布</button>
            </li>
        </section>
    </section>
</div>

</body>
</html>
<script type="text/javascript">
    new SYSVerification({
        Verification: 'appraisal', //验证区域
        Submit: 'modifybtn1', //提交按钮名称
        Empty: 'Emptybtn1',
        Datamode: 'json',
        FailurePrompt: '添加失败请从新输入', //请求失败提示
        Formmode: 'submitmode',
        SubmitMethod: function (index, data, newarr) { //index方法集合  data为拼接形式，不适合待&标签的文本内容 ,newarr为json格式
            var mode = index.par.Datamode;
            if (mode == "json") {
                var str = JSON.stringify(newarr);
                var json = str.replace(/\[|]/g, '');
                ID$('jsoncontent').innerHTML = json;
                //index.ajaxPost('../../php/submit.php?action=insertjson',null, json); //url地址，data获取数据
            }
        }, //提交验证回调方法
        Load: function (index, conttext) { }, //加载数据用于获取数据
        ConfirmCallback: function (index, data) {

            index.PromptBox("评价成功", 2);
        }, //确认回调方法
        Expand: function (index) { }, //扩展
        ExtendMethod: function (index, conttext) {
            var muster = index.getByClass(conttext[1], 'ace');
            for (var i = 0; i < muster.length; i++) {
                muster[i].onclick = function (e) {
                    var evt = e || window.event;
                    var tar = evt.target || evt.srcElement;
                    var text = tar.parentNode.innerText;
                    if (tar.checked == true) {
                        ID$('textarea').value += text + ' ,';
                    } else {
                        var content = ID$('textarea').value;
                        ID$('textarea').value = content.replace(text + ' ,', '');
                    }
                }
            }
        }
    });
</script>
<script>
    var vm = new Vue({
        el: "#evaluateApp",
        data: {
            orderId:'',
            item:'',
        },
        computed:{

        },
        created(){
            this.loadOrderDetailData()
        },
        // watch:{
        //     "page":{
        //         handler(){
        //             this.loadOrderData()
        //         }
        //     }
        // },
        methods:{
            loadOrderDetailData(){
                this.orderId = ly.getUrlParam("orderId")
                ly.http.get("/order/"+this.orderId
                ).then(res=>{
                    this.item = res.data
                    const detailList = this.item.detailList
                    detailList.forEach(detail=>{
                        // this.evaluateMap[detail.skuId] = ''
                        this.$set(detail, "text", ""); //存评价文字
                        this.$set(detail, "score", 0); //分数
                    })

                })
            },
            addEvaluate(){
                const evaluateList = [];  //所有评价信息数组
                const detailList =  this.item.detailList
                detailList.forEach(detail=>{
                    let  evaluate = {
                        orderId:detail.orderId,
                        skuId:detail.skuId,
                        text:detail.text,
                        score:detail.score
                    }
                    evaluateList.push(evaluate)
                })
                ly.http.post("/order/evaluate/insert/list",evaluateList)
                    .then(res=>{
                        window.location.href = "/home-order-evaluate.html"
                    })

            }

            }

        // components:{
        //     lyTop: () => import("./js/pages/top.js")
        // }
    });
</script>
